<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
<meta name="format-detection" content="telephone=no">
<title>网上购票</title>
<link rel="stylesheet" href="resources/css/frozen.css">
<link rel="stylesheet" href="resources/css/main.css">
<script src="resources/lib/zepto.min.js"></script>
<script src="resources/js/frozen.js"></script>
<script src="resources/js/config.js"></script>
<script src="resources/js/main.js"></script>
<style>
#info-dialog-table {
	width: 100%;
}
#info-dialog-table th {
	font-weight: normal;
	line-height: 30px;
}
</style>
</head>
<body ontouchstart="">
	<header class="ui-header ui-header-positive ui-border-b">
		<h1>查询购票</h1>
	</header>
	<footer class="ui-footer ui-footer-btn">
		<ul id="footer" class="ui-tiled ui-border-t">
			<li data-href="index.html" class="ui-border-r">
				<div>查询购票</div>
			</li>
			<li data-href="order.html" class="ui-border-r">
				<div>订单查询</div>
			</li>
			<li data-href="member.html">
				<div>会员中心</div>
			</li>
		</ul>
	</footer>
	<section class="ui-container">
		<section>
			<div class="ui-form ui-border-t" style="margin: 20px 0 10px;">
				<form action="#">
					<div id="start-station-container" class="ui-form-item ui-form-item-show ui-border-b">
						<label for="start-station-name">起&nbsp;&nbsp;点&nbsp;&nbsp;站</label>
						<input id="start-station-id" type="hidden">
						<input id="start-station-name" type="text" readonly>
						<input id="sell-day" type="hidden">
					</div>
					<div id="end-station-container" class="ui-form-item ui-form-item-show ui-border-b">
						<label for="end-station-name">终&nbsp;&nbsp;点&nbsp;&nbsp;站</label>
						<input id="end-station-id" type="hidden">
						<input id="end-station-name" type="text" readonly>
					</div>
					<div id="bus-date-container" class="ui-form-item ui-form-item-show ui-border-b">
						<label for="bus-date">乘车日期</label>
						<input id="bus-date" type="text" readonly>
					</div>
				</form>
			</div>
			<div class="ui-btn-wrap">
				<button id="btn-search" class="ui-btn-lg ui-btn-primary">查&nbsp;&nbsp;&nbsp;&nbsp;询</button>
			</div>
		</section>
		<section id="recent-route-container" class="ui-selector" style="display: none;">
			<header>
				<h3>最近查询</h3>
			</header>
			<ul id="recent-route-list" class="ui-list ui-list-text ui-list-cover ui-border-tb">
			</ul>
			<div class="ui-btn-wrap">
				<button id="btn-clear-recent-route" class="ui-btn-lg"> 清空 </button>
			</div>
		</section>
	</section>
	
	<div id="info-dialog" class="ui-dialog">
		<div class="ui-dialog-cnt">
			<div class="ui-dialog-bd">
				<div>
					<h4 id="info-dialog-title" style="text-align: center; font-weight:bold; margin-bottom:5px;"></h4>
					<div id="info-dialog-content">
						<table id="info-dialog-table">
							<tr><th>订单号：</th><td id="info-dialog-order-id"></td></tr>
							<tr><th>发车日期：</th><td id="info-dialog-bus-date"></td></tr>
							<tr><th>发车时间：</th><td id="info-dialog-bus-start-time"></td></tr>
							<tr><th>座位号：</th><td id="info-dialog-seat-list"></td></tr>
							<tr><th>支付金额：</th><td id="info-dialog-total-price"></td></tr>
							<tr id="pass-row" style="display: none;"><th>取票密码：</th><td id="info-dialog-pass"></td></tr>
						</table>
					</div>
				</div>
			</div>
			<div class="ui-dialog-ft ui-btn-group">
				<button type="button" data-role="button"  class="select" id="btn-success-dialog-close">关闭</button> 
			</div>
		</div>
	</div> 
<script>

(function (){

	/* -------------------- 判断是否为微信浏览器 -------------------- */
	
	if(appConfig.isWeixin) {
		ajax({
			url: appConfig.baseUrl + "/wechat",
			data: {
				type: 7
			},
			success: function(data){
				if(data.success) {
					var member = data.member;
					
					sessionStorage.memberId = member.memberId;
					sessionStorage.memberName = member.memberName;
					sessionStorage.mobile = member.mobile;
					sessionStorage.idCard = member.idcard;
					sessionStorage.score = member.score || '';
					sessionStorage.wechatAcc = member.wechatAcc;
				}
			},
			error: function(xhr, statusText, error){
				
			}
		});
	} else {
		// 判断是否为wap支付成功后的跳转
		var status = getQueryString("status");
		var orderId = getQueryString("OrderId");
		var busDate = getQueryString("busDate");
		var busStartTime = getQueryString("busStartTime");
		var seatList = getQueryString("SeatList");
		var price = getQueryString("totalPrice");
		var pass = getQueryString("Pass");

		$("#info-dialog-order-id").html(orderId);
		$("#info-dialog-bus-date").html(busDate);
		$("#info-dialog-bus-start-time").html(busStartTime);
		$("#info-dialog-seat-list").html(seatList);
		$("#info-dialog-total-price").html(price);
		$("#pass-row").hide();
		
		if(!!status) {
			if(status=='0'){
				$("#info-dialog-title").html("订单待支付");
			} else if (status=='1'){
				$("#info-dialog-title").html("订单支付成功");
				$("#pass-row").show();
				$("#info-dialog-pass").html(pass);
			} else if (status=='3'){
				$("#info-dialog-title").html("订单已作废");
			}
			
			var dialog=$("#info-dialog").dialog("show");
		}
	}

	/* -------------------- 根据sessionStorage中的值，初始化界面 -------------------- */
	
	// 初始化起点站查询条件
	if(!!sessionStorage.startStationName) {
		$("#start-station-id").val(sessionStorage.startStationId);
		$("#start-station-name").val(sessionStorage.startStationName);
		$("#sell-day").val(sessionStorage.sellDay);
	}
	
	// 初始化终点站查询条件
	if(!!sessionStorage.endStationName) {
		$("#end-station-id").val(sessionStorage.endStationId);
		$("#end-station-name").val(sessionStorage.endStationName);
	}
    
    // 初始化乘车日期查询条件
	if(!sessionStorage.busDate) {
		sessionStorage.busDate = formatDate(new Date());
		
	}
	
	$("#bus-date").val(sessionStorage.busDate);
	
	/* -------------------- 根据localStorage中的值，初始化界面 -------------------- */
	
	// 加载最近查询线路
	showRecentRoutes();
	
	/* -------------------- 事件绑定 -------------------- */
	
	// 起点站点击事件
	$("#start-station-container").tap(function(){
		location.href = "selectStartStation.html";
	});
	
	// 终点站点击事件
	$("#end-station-container").tap(function(){
		location.href = "selectEndStation.html";
	});
    
    // 乘车日期点击事件
	$("#bus-date-container").tap(function(){
		var startStationId = $('#start-station-id').val();
		if(!startStationId) {
			showInfoTip("请先选择起点站");
			return;
		}
		
		location.href = "selectBusDate.html";
	});
	
	// 查询按钮点击事件
	$("#btn-search").tap(function(){
		var startStationId = $('#start-station-id').val();
		var startStationName = $('#start-station-name').val();
		var endStationId = $('#end-station-id').val();
		var endStationName = $('#end-station-name').val();
		var busDate = $('#bus-date').val();
		var sellDay = $('#sell-day').val();
		
		if(!startStationId) {
			showInfoTip("请选择起点站");
			return;
		}

		if(!endStationId) {
			showInfoTip("请选择终点站");
			return;
		}
		
		if(!busDate) {
			showInfoTip("请选择乘车日期");
			return;
		}
		
		addRecentRoutes({
			routeId: startStationId + '|' + endStationId,
			startStationId: startStationId,
			startStationName: startStationName,
			endStationId: endStationId,
			endStationName: endStationName,
			sellDay: sellDay,
		});
		
		location.href = "busList.html";
	});
	
	// 最近查询列表点击事件
    $(document).on("tap", "#recent-route-list li", function(){
		var startStationId = $(this).attr('start-station-id');
		var startStationName = $(this).attr('start-station-name');
		var endStationId = $(this).attr('end-station-id');
		var endStationName = $(this).attr('end-station-name');
		var sellDay = $(this).attr('sell-day');
		
		sessionStorage.startStationId = startStationId;
		sessionStorage.startStationName = startStationName;
		sessionStorage.endStationId = endStationId;
		sessionStorage.endStationName = endStationName;
		sessionStorage.sellDay = sellDay;
		
		$('#start-station-id').val(startStationId);
		$('#start-station-name').val(startStationName);
		$('#end-station-id').val(endStationId);
		$('#end-station-name').val(endStationName);
		$('#sell-day').val(sellDay);
	});
	
	// 清空最近查询线路按钮点击事件
	$("#btn-clear-recent-route").tap(function(){
		clearRecentRoutes();
	});
	
	// 底部主菜单初始化
	initFooter("#footer");
})();

// 显示常用线路
function showRecentRoutes() {
	var recentRouteList = getRecentRoutes();
	if(!!recentRouteList && recentRouteList.length>0) {}
	if(recentRouteList.length>0) {
		$("#recent-route-list").empty();
		for(var i=0; i<recentRouteList.length; i++) {
			var route = recentRouteList[i];
			$("#recent-route-list").append(
				"<li class='ui-border-t' start-station-id='" + route.startStationId + 
				"' start-station-name='" + route.startStationName + 
				"' end-station-id='" + route.endStationId + 
				"' end-station-name='" + route.endStationName + 
				"' sell-day='" + route.sellDay + 
				"'>" + route.startStationName + " - " + route.endStationName + "</li>"
			);
		}
		$("#recent-route-container").show();
	}
}

// 新增常用线路
function addRecentRoutes(route) {
	var recentRouteList = getRecentRoutes();
	for(var i=0; i<recentRouteList.length; i++) {
		var r = recentRouteList[i];
		if(r.routeId===route.routeId) {
			return;
		}
	}
	recentRouteList.push(route);
	localStorage.setItem("recentRoutes", JSON.stringify(recentRouteList));
}

// 清空常用线路
function clearRecentRoutes() {
	localStorage.removeItem("recentRoutes");
		$("#recent-route-container").hide();
		$("#recent-route-list").empty();
}

// 从本地存储获取常用线路
function getRecentRoutes() {
	var recentRoutes = localStorage.getItem("recentRoutes");
	if(!!recentRoutes) {
		return JSON.parse(recentRoutes);
	} else {
		return [];
	}
}
</script>
</body>
</html>